<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>poetry 后台管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="icon" type="image/ico" href="/images/logo.png"/>

    <link rel="stylesheet" href="/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="/layui/css/common.css" media="all">
    <link rel="stylesheet" href="/css/bly-icon.css" media="all">
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
    <div th:replace="user/common::headerhtml"></div>
    <!--    <div th:replace="user/common::menuhtml"></div>-->
    <div class="layui-container">
        <!-- 内容主体区域 -->
        <div style="padding-top: 15px;">
            <div class="bly-panel" style="margin-bottom: 0;">
                <div class="bly-panel-title bly-filter">
                    <a href="/page/editor" class="layui-this">添加文章</a>
                    <span class="bly-remind">请勿发表任何违规、违法的内容</span>
                </div>
                <ul class="bly-list layui-icon">
                    <li>
                        <a href="/u/22632120" class="bly-avatar">
                            <img src="//thirdqq.qlogo.cn/qqapp/101235792/55C790D042D00FC8876B99C3E0271FFE/100"
                                 alt="游荡岁月">
                        </a>
                        <h2><a class="layui-badge">原创</a> <a href="/page/editor/1"> layer.photos 鼠标滚动收缩放大及旋转功能</a></h2>
                        <div class="bly-list-info">
                            <span>1小时前</span>
                            <span><i class="iconfont icon-liulanyanjing" title="浏览"></i> 0 </span>
                            <span><i class="iconfont icon-zan" title="赞"></i> 0 </span>
                            <span><i class="iconfont icon-pinglun1" title="回复"></i> 0 </span>
                            <span class="bly-list-nums"><a href="javascript:void(0)" class="bly-error">删除</a></span>
                        </div>
                        <div class="bly-list-badge"></div>
                    </li>
                </ul>
            </div>

        </div>
    </div>

    <div th:replace="user/common::footerhtml"></div>
</div>
<script src="/layui/layui.js" charset="utf-8"></script>
<script src="/layui/menu.js" charset="utf-8"></script>
<script>
    //JavaScript代码区域
    layui.use(['element', 'layer'], function () {
        var element = layui.element,
            $ = layui.jquery;
        $.ajax({
            url: '/article/list',
            type: 'post',
            dataType: 'json',
            success: function (res) {
                if (res.status != 200) {
                    layer.alert(res.msg, {icon: 5})
                    return;
                }
                var datas = res.data;
                var html = "";
                $.each(datas, function (i, item) {
                    html += '<li>\n' +
                        '    <a href="javascript:void()" class="bly-avatar">\n' +
                        '        <img src="' + item.imgUrl + '" alt="">\n' +
                        '    </a>\n' +
                        '    <h2><a class="layui-badge">' + item.articleType + '</a> <a href="/page/editor/' + item.id + '"> ' + item.title + '</a></h2>\n' +
                        '    <div class="bly-list-info">\n' +
                        '        <span> ' + item.createTime + '</span>\n' +
                        '        <span><i class="iconfont icon-liulanyanjing" title="浏览"></i> ' + (item.browseNum || 0) + ' </span>\n' +
                        '        <span><i class="iconfont icon-zan" title="赞"></i> ' + (item.praiseNum || 0) + ' </span>\n' ;
                    if (item.id == 0) {
                        html += '<span class="bly-list-nums"></span>\n';
                    } else {
                        html += '<span class="bly-list-nums"><a href="javascript:void(0)" class="bly-error" data-method="del" data-id="' + item.id + '">删除</a></span>\n';
                    }

                    html += '    </div>\n' +
                        '    <div class="bly-list-badge"></div>\n' +
                        '</li>';
                });
                $('.bly-list').html(html);
                $('.bly-error').on('click', function () {
                    var method = $(this).data('method');
                    active[method] ? active[method].call(this) : '';
                });
            }
        });

        var active = {
            del: function () {
                var id = $(this).data('id');
                layer.alert("删除后将无法恢复，确定删除？", {
                    icon: 8,
                    time: 0
                    , btn: ['确定', '取消']
                    , yes: function () {
                        $.ajax({
                            url: '/article/del/' + id,
                            type: 'post',
                            dataType: 'json',
                            success: function (res) {
                                if (res.status != 200) {
                                    layer.alert("删除成功！", {icon: 5});
                                    return;
                                }
                                layer.alert("删除成功！", {
                                    icon: 6, time: 0, yes: function () {
                                        location.href = "/page/list"
                                    }
                                });
                            }
                        });
                    }
                });

            },
            pinglun: function () {

            }
        }


    });

</script>
</body>
</html>
